<template>
  <div class="review-record-list">
    <a-card title="审查记录">
      <a-form layout="inline" class="search-form">
        <a-form-item label="审查类型">
          <a-select v-model:value="searchForm.review_type" placeholder="请选择" style="width: 150px" allow-clear>
            <a-select-option value="extra">附加分审查</a-select-option>
            <a-select-option value="punish">处分审查</a-select-option>
            <a-select-option value="score">综测审查</a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item label="状态">
          <a-select v-model:value="searchForm.status" placeholder="请选择" style="width: 150px" allow-clear>
            <a-select-option value="pending">待审核</a-select-option>
            <a-select-option value="approved">已通过</a-select-option>
            <a-select-option value="rejected">已拒绝</a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item>
          <a-space>
            <a-button type="primary" @click="handleSearch">查询</a-button>
            <a-button @click="handleReset">重置</a-button>
          </a-space>
        </a-form-item>
      </a-form>

      <a-table 
        :columns="columns" 
        :data-source="dataSource" 
        :loading="loading"
        bordered 
        :pagination="pagination"
      >
        <template #bodyCell="{ column, record }">
          <template v-if="column.key === 'review_type'">
            <a-tag color="blue">
              {{ getReviewTypeText(record.review_type) }}
            </a-tag>
          </template>
          <template v-if="column.key === 'status'">
            <a-tag :color="getStatusColor(record.status)">
              {{ getStatusText(record.status) }}
            </a-tag>
          </template>
          <template v-if="column.key === 'review_time'">
            {{ record.review_time ? new Date(record.review_time).toLocaleString() : '-' }}
          </template>
        </template>
      </a-table>
    </a-card>
  </div>
</template>

<script setup lang="ts">
import { ref, reactive, onMounted } from 'vue'
import { message } from 'ant-design-vue'
import { reviewRecordAPI } from '@/api/reviewRecord'
import type { ReviewRecord } from '@/api/reviewRecord'

const loading = ref(false)
const dataSource = ref<ReviewRecord[]>([])

const searchForm = reactive({
  review_type: undefined as 'extra' | 'punish' | 'score' | undefined,
  status: undefined as 'pending' | 'approved' | 'rejected' | undefined
})
const columns = [
  { title: 'ID', dataIndex: 'id', key: 'id', width: 70 },
  { title: '审查类型', dataIndex: 'review_type', key: 'review_type', width: 120 },
  { title: '学生', dataIndex: 'student', key: 'student', width: 120 },
  { title: '审核人', dataIndex: 'reviewer', key: 'reviewer', width: 120 },
  { title: '状态', key: 'status', width: 100 },
  { title: '审核内容', dataIndex: 'content', key: 'content' },
  { title: '审核时间', dataIndex: 'review_time', key: 'review_time', width: 180 }
]
const pagination = ref({
  total: 0,
  current: 1,
  pageSize: 10,
  showTotal: (total: number) => `共 ${total} 条`,
  onChange: (page: number, pageSize: number) => {
    pagination.value.current = page
    pagination.value.pageSize = pageSize
    loadData()
  }
})

// 加载数据
const loadData = async () => {
  loading.value = true
  try {
    const res = await reviewRecordAPI.getReviewRecordList({
      page: pagination.value.current,
      page_size: pagination.value.pageSize,
      review_type: searchForm.review_type,
      status: searchForm.status
    })
    dataSource.value = res.data.results
    pagination.value.total = res.data.count
  } catch (error: any) {
    message.error('加载数据失败: ' + (error.response?.data?.message || error.message))
  } finally {
    loading.value = false
  }
}

// 搜索
const handleSearch = () => {
  pagination.value.current = 1
  loadData()
}

// 重置
const handleReset = () => {
  searchForm.review_type = undefined
  searchForm.status = undefined
  pagination.value.current = 1
  loadData()
}

// 获取审查类型文本
const getReviewTypeText = (type: string) => {
  const typeMap: Record<string, string> = {
    'extra': '附加分审查',
    'punish': '处分审查',
    'score': '综测审查'
  }
  return typeMap[type] || type
}

// 获取状态文本
const getStatusText = (status: string) => {
  const statusMap: Record<string, string> = {
    'pending': '待审核',
    'approved': '已通过',
    'rejected': '已拒绝'
  }
  return statusMap[status] || status
}

// 获取状态颜色
const getStatusColor = (status: string) => {
  const colorMap: Record<string, string> = {
    'pending': 'orange',
    'approved': 'green',
    'rejected': 'red'
  }
  return colorMap[status] || 'default'
}

onMounted(() => {
  loadData()
})
</script>

<style scoped>
.search-form { margin-bottom: 20px; }
</style>
